<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{
				margin: 0;
				padding: 0;
			}
			a{
				text-decoration: none;
				color: #fff;
			}
			li{
				list-style: none;
			}
			.nav{
				width: 1250px;
				height: 50px;
				background: #459df5;
				margin: auto;
			}
			.nav>ul>li{
				float: left;
				line-height: 50px;
				text-align: center;
				width: 250px;
				cursor: pointer;
			}
			.nav>ul>li>ul{
				width: 250px;
				height: 400px;
				background: #386fa6;
				text-align: center;
				display: none;
			}
		</style>
	</head>
	<body>
	<div class="nav">
		<ul>
			<li>
				<a href="javascript:void(0)">首页</a>
				<ul>
					<li></li>
				</ul>
			</li>
			<li>
				<a href="javascript:void(0)">关于我们</a>
				<ul>
					<li><a href="#">团队介绍</a></li>
					<li><a href="#">服务QQ群</a></li>
					<li><a href="#">个人业务</a></li>
				</ul>
			</li>
			<li>
				<a href="javascript:void(0)">软件下载</a>
				<ul>
					<li><a href="#">Web编译工具</a></li>
					<li><a href="#">左面整理工具</a></li>
				</ul>
			</li>
			<li>
				<a href="javascript:void(0)">招贤纳士</a>
				<ul>
					<li><a href="#">Web前端工程师</a></li>
					<li><a href="#">JavaWeb前端工程师</a></li>
					<li><a href="#">App开发工程师</a></li>
					<li><a href="#">数据库工程师</a></li>
					<li><a href="#">软件架构师</a></li>
					<li><a href="#">技术客服</a></li>
				</ul>
			</li>
			<li>
				<a href="javascript:void(0)">给我留言</a>
				<ul>
					<li><a href="#">站内留言</a></li>
					<li><a href="#">站长信箱</a></li>
				</ul>
			</li>
		</ul>
	</div>
	<script src="jquery-1.11.2.min.js"></script>
	<script type="text/javascript">
		$(function(){
			$('.nav>ul').mouseenter(function(){
				$(this).children().children('ul').show().css('background','#406c98');
			});
			$('.nav>ul>li').mouseenter(function(){
				$(this).arrt('background','#4a91d7').siblings().css('background','#459df5');
				$(this).children('ul').css('background','#4a91d7');
				$(this).children('ul').siblings('ul').css('background','#386fa6');
			});
			
			
			
			
			
			
			
			$('.nav>ul').mouseleave(function(){
				$(this).children().children('ul').hide();
			});
			
		});
	</script>
	</body>
</html>
